<!DOCTYPE html>
<html>
<head>
<base href="${basePath}">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>樾瑜伽管理系统-主页</title> $!{include("import_js_css.html")}
<!-- plupload -->
<script type="text/javascript" src="${assetsPath}/js/plupload/plupload.full.min-2.1.2.js"></script>
<script type="text/javascript" src="${assetsPath}/js/plupload/i18n/zh_CN.js"></script>
<style type="text/css">
.datagrid-row {
	height: 40px !important;
}

.date-today {
	color: red !important;
}

.seat-info-item {
	float: left;
	width: 70px;
	height: 22px;
	border: 1px solid #ccc;
	border-radius: 3px;
	margin-top: 3px;
	margin-left: 3px;
	text-align: center;
	line-height: 22px;
	color: #ccc;
}
.reserved {
	color:#000;
	background-color:#00ccff;
}

.attended {
	color:#000;
	background-color:#33ff66;
}
</style>
<script type="text/javascript">
	var uploader;
	$(function() {
		changeToLessionList();
		$("#tabPanel").tabs({
			onSelect : function(title, index) {
				if (title == "课程列表") {
					changeToLessionList();
				} else if (title == "今日课程") {
					changeToTodayLession();
				} else if (title == "明日课程") {
					changeToTomorrowLession();
				} else if (title == "会员信息") {
					changeToMemberList();
				} else if (title == "在店会员") {
					changeToPresentMemberList();
				} else if (title == "离店会员") {
					changeToUnPresentMemberList();
				} else if (title == "出勤记录") {
					changeToConsumeList();
				}
			}
		});
		//头像上传
		build_plupload();

		//会员查询
		$("#searchMemberBtn").click(function() {
			var hykh = $("#iptHykh").val();
			var hysjh = $("#iptHysjh").val();
			var hyxm = $("#iptHyxm").val();
			var hykx = $("#iptHykx").combobox("getValue");

			//载入表格数据
			$("#member-list").datagrid("load", {
				hykh : hykh,
				hysjh : hysjh,
				hyxm : hyxm,
				hykx : hykx
			});
		});

		//会员刷卡明细查询
		$("#searchMemberDetailBtn").textbox({
			onClickButton : function() {
				var text = $(this).textbox("getValue");
				searchAndShowMember(text)
			}
		});

		//查看会员出勤
		$("#searchMemberConsumeListBtn").click(function() {
			var tab = $("#tabPanel").tabs("getSelected");
			var options = tab.panel("options");
			var title = options.title;

			if (title == "出勤记录") {
				var memberId = $("#cacheMemberId").val();
				changeToConsumeList(memberId);
			} else {
				$("#tabPanel").tabs("select", "出勤记录");
			}
		});

		//预约订座窗口
		$("#reserveSeatBtn").click(function() {
			$("#reserveDialog").dialog("open");
		});

		//预约今天窗口
		$("#reserveTodayBtn").click(function() {
			showReserveWindow(0);

		});

		//预约明天窗口
		$("#reserveTomorrowBtn").click(function() {
			showReserveWindow(1);
		});
		
		//安全退出
		$("#logoutBtn").click(function(){
			var url = "yueyogaPadAdmin/ajaxLogout.jhtml";
			window.location.href = url;
		});
	});

	//初始化上传控件
	function build_plupload() {
		uploader = new plupload.Uploader({
			runtimes : "html5,gears,flash,browserplus,html4",
			browse_button : "chooseHeadImgBtn",
			container : $("#chooseHeadImgContainer").get(0),
			url : "${basePath}/yueyogaPadAdmin/ajaxUploadHeadImg.jhtml",
			unique_names : true,
			file_data_name : "file",
			filters : {
				max_file_size : '10mb',
				mime_types : [ {
					title : "Image files",
					extensions : "jpg,png"
				} ]
			},
			flash_swf_url : '${assetsPath}/js/plupload/Moxie.swf',
			resize : {
				width : 660,
				height : 800,
				quality : 100
			},
			multi_selection : false,//文件单上传
			init : {
				PostInit : function() {
					//do nothing...
				},
				FilesAdded : function(up, files) {
					//添加到文件队列
					plupload.each(files, function(file) {
						$("#headImgContainer #hytx").hide();
						$("#headImgContainer").append($("<div class='imginfo'>" + plupload.formatSize(file.size) + "</div>"));
					});
					//立即启动上传
					var memberId = $("#cacheMemberId").val();
					uploader.setOption({
						multipart_params : {
							memberId : memberId
						}
					});
					uploader.start();
				},
				UploadProgress : function(up, file) {
					//上传进度
					$("#headImgContainer .imginfo").text(file.percent + "%");
				},
				FileUploaded : function(up, file, resp) {
					var json = eval("(" + resp.response + ")");
					;
					//每一个文件上传完毕,上传到服务器
					if (json.success) {
						$("#headImgContainer .imginfo").remove();
						$("#headImgContainer #hytx").attr("src", "${basePath}" + json.path).show();
					} else {
						$.messager.alert("错误", json.error);
					}
				},
				UploadComplete : function(up, file) {
					//全部文件上传完毕
					//do nothing...
				},
				Error : function(up, err) {
					$.messager.alert("错误", "图片上传异常，文件大小不能超过1m，且必须是jpg或png格式");
				}
			}
		});
		uploader.init();
	}

	//切换到明天课程
	function changeToTomorrowLession() {
		var today = new Date();
		var tommorow = new Date(today.getTime() + 24 * 60 * 60 * 1000);
		var year = tommorow.getFullYear();
		var month = tommorow.getMonth() + 1;
		var day = tommorow.getDate();
		month = month < 10 ? "0" + month : month;
		day = day < 10 ? "0" + day : day;

		$("#tomorrow-lession-list").datagrid({
			title : "今日课程(" + (month + "-" + day) + ")",
			border : false,
			url : 'yueyogaPadAdmin/ajaxGetLessionsByDate.jhtml',
			singleSelect : true,
			autoRowHeight : false,
			queryParams : {
				kcrq : month + "-" + day
			}
		});
	}

	//切换到今天课程
	function changeToTodayLession() {
		var today = new Date();
		var year = today.getFullYear();
		var month = today.getMonth() + 1;
		var day = today.getDate();
		month = month < 10 ? "0" + month : month;
		day = day < 10 ? "0" + day : day;

		$("#today-lession-list").datagrid({
			title : "今日课程(" + (month + "-" + day) + ")",
			border : false,
			url : 'yueyogaPadAdmin/ajaxGetLessionsByDate.jhtml',
			singleSelect : true,
			autoRowHeight : false,
			queryParams : {
				kcrq : month + "-" + day
			}
		});
	}

	//切换到课程列表
	function changeToLessionList() {
		//加载日期列表
		var url = "yueyogaPadAdmin/ajaxGetLessionsDateList.jhtml";
		$.post(url, function(json) {
			if (json.success) {
				var week1 = json.week1;
				var week2 = json.week2;

				$("#lession-date-list tbody tr").remove();

				if (week1) {
					var tr = $("<tr></tr>");
					$.each(week1, function(idx, item) {
						tr.append($("<td><a class='easyui-linkbutton' style='width:60px'>" + item + "</td>"));
					});
					$("#lession-date-list tbody").append(tr);
				}
				if (week2) {
					var tr = $("<tr></tr>");
					$.each(week2, function(idx, item) {
						tr.append($("<td><a class='easyui-linkbutton' style='width:60px'>" + item + "</td>"));
					});
					$("#lession-date-list tbody").append(tr);
				}
				//变成easyuilinkbutton
				$("#lession-date-list tbody tr td a").linkbutton();
				//当前天特殊样式
				$("#lession-date-list tbody tr:first td:eq(" + (json.week - 1) + ") a").addClass("date-today");

				//重载课程列表
				$("#lession-date-list tbody").on("click", "tr td a", function() {
					var d = $(this).text();
					$("#lession-list").datagrid({
						title : "课程列表(" + d + ")",
						queryParams : {
							kcrq : d
						}
					});
				});
			}
		}, "json");

		var today = new Date();
		var year = today.getFullYear();
		var month = today.getMonth() + 1;
		var day = today.getDate();
		month = month < 10 ? "0" + month : month;
		day = day < 10 ? "0" + day : day;

		$("#lession-list").datagrid({
			title : "课程列表(" + (month + "-" + day) + ")",
			border : false,
			url : 'yueyogaPadAdmin/ajaxGetLessionsByDate.jhtml',
			singleSelect : true,
			autoRowHeight : false,
			queryParams : {
				kcrq : month + "-" + day
			},
			onLoadSuccess : function() {
				//不加此句,则布局无法自动调整
				$("#lession-date-list-layout").layout();
			},
			onClickRow : function(idx, row) {
				var kcxh = row.kcxh;
				var kcrq = row.kcrq;
				var url = "yueyogaPadAdmin/ajaxGetSeatReserveInfo.jhtml";
				
				$.post(url,{
					kcxh:kcxh,
					searchDate:kcrq
				},function(json){
					if(json.success){
						$("#seat-info div").remove();
						if(json.rows && json.rows.length>0){
							$.each(json.rows,function(idx,item){
								if(item.memberId){
									if(item.state == "是"){
										$("#seat-info").append($("<div class='seat-info-item attended'>" + item.memberName + "</div>"));
									}else {
										$("#seat-info").append($("<div class='seat-info-item reserved'>" + item.memberName + "</div>"));
									}
								}else {
									$("#seat-info").append($("<div class='seat-info-item'>" + item.seatNo + "</div>"));
								}
							});
						}
					}else {
						//未查询到订座信息
					}
				},"json");
			}
		});
	}

	var memberListFirstInited = false;
	var memberListLocalData;
	//切换到查询会员列表
	function changeToMemberList() {
		if (memberListFirstInited == false) {
			$("#member-list").datagrid({
				border : false,
				pagination : true,
				singleSelect : true,
				onClickRow : function(idx, row) {
					showMemberDetail(row.hybh);
				},
				onBeforeLoad : function() {
					if (memberListLocalData) {
						$("#member-list").datagrid("loadData", memberListLocalData);
						memberListLocalData = null;
						return false;
					}
				}
			});
			memberListFirstInited = true;
		} else {
			if (memberListLocalData) {
				$("#member-list").datagrid("loadData", memberListLocalData);
				memberListLocalData = null;
			} else {
				$("#member-list").datagrid("load");
			}
		}
	}

	//切换到在店会员
	function changeToPresentMemberList() {
		$("#present-member-list").datagrid({
			border : false,
			pagination : true,
			singleSelect : true,
			onClickRow : function(idx, row) {
				showMemberDetail(row.hybh);
			}
		});
	}

	//切换到离店会员
	function changeToUnPresentMemberList() {
		$("#unpresent-member-list").datagrid({
			border : false,
			pagination : true,
			singleSelect : true,
			onClickRow : function(idx, row) {
				showMemberDetail(row.hybh);
			}
		});
	}

	var consumeListFirstInited = false;
	//切换到考勤记录
	function changeToConsumeList(memberId) {
		var mid = memberId || $("#cacheMemberId").val();

		if (consumeListFirstInited == false) {
			$("#consume-list").datagrid({
				border : false,
				pagination : true,
				singleSelect : true,
				queryParams : {
					memberId : mid
				}
			});
			consumeListFirstInited = true;
		} else {
			$("#consume-list").datagrid("load", {
				memberId : mid
			});
		}
	}

	//查询并显示会员详细信息,如果查询仅有结果,直接显示,否则显示到列表中
	function searchAndShowMember(content) {
		if (content) {
			var url = "yueyogaPadAdmin/ajaxSearchAndShowMember.jhtml";
			$.post(url, {
				content : content
			}, function(json) {
				if (json.success) {
					var data = json.rows;
					if (data.length == 0) {
						$.messager.alert("提示", "未查找到符合条件的会员");
					} else if (data.length == 1) {//仅查询到一个结果,则直接显示
						setMemberDetailInfo(data[0]);
					} else {
						var tab = $("#tabPanel").tabs("getSelected");
						var options = tab.panel("options");
						var title = options.title;
						if (title == "会员信息") {
							$("#member-list").datagrid("loadData", data);
						} else {
							memberListLocalData = data;
							$("#tabPanel").tabs("select", "会员信息");
						}
					}
				} else {
					$.messager.alert("错误", json.error);
				}
			}, "json");
		} else {//未获得输入
			setMemberDetailInfo({
				hybh : "",
				prId : "",
				hykh : "",
				hyxm : "",
				lxdh : "",
				cpmc : "",
				kssj : "",
				jssj : "",
				hjgw : "",
				hyzt : "",
				hyzzt : "",
				cplx : ""
			});
		}
	}

	//显示会员详细信息
	function showMemberDetail(memberId) {
		if (memberId) {
			var url = "yueyogaPadAdmin/ajaxGetMemberDetail.jhtml";
			$.post(url, {
				memberId : memberId
			}, function(json) {
				if (json.success) {
					var data = json.data;
					setMemberDetailInfo(data);
				}
			}, "json");
		}
	}

	//设置会员详细信息
	function setMemberDetailInfo(data) {
		if (data.hytx) {
			//设置会员头像
			headImgPath = "${basePath}" + data.hytx;
			//设置会员头像
			$("#hytx").attr("src", headImgPath);
		} else {
			$("#hytx").removeAttr("src");
		}

		$("#cacheMemberId").val(data.hybh);
		$("#cacheMemberProductRemainingId").val(data.prId);

		$("#hykh").text(data.hykh);
		$("#hyxm").text(data.hyxm);
		$("#hysjh").text(data.lxdh);
		$("#hykx").text(data.cpmc);
		$("#kssj").text(data.kssj);
		$("#jssj").text(data.jssj);
		$("#hjgw").text(data.hjgw);
		$("#hyzt").text(data.hyzt);
		$("#hyzzt").text(data.hyzzt);

		if (data.cplx == "按次数") {
			$("#sycs").text(data.cpcs);
		} else {
			$("#sycs").text("-");
		}
	}

	//弹出预约课程窗口 flag:0 今天 flag:1 明天 
	function showReserveWindow(flag) {
		var classId = $("#yoga-classes").combobox("getValue");
		var memberId = $("#cacheMemberId").val();

		if (classId == undefined || classId == "") {
			$("#reserveDialog").dialog("close");
			$.messager.alert("提示", "请先选择班级");
			return;
		}

		if (memberId == undefined || memberId == "") {
			$("#reserveDialog").dialog("close");
			$.messager.alert("提示", "请先选择会员");
			return;
		}

		var title = "预约今天";
		if (flag == 1) {
			title = "预约明天";
		}

		$("#reserveDetailDialog").dialog({
			title : title,
			onClose : function() {
				$("#reserveDialog").dialog("close");
			},
			buttons : [ {
				text : "&nbsp;&nbsp;预定&nbsp;&nbsp;",
				handler : function() {
					var selected = $("#reserve-lession-list").datagrid("getSelected");
					if (selected == undefined || selected == null) {
						$.messager.alert("提示", "请选中您要预定的课程");
						return;
					}

					if (selected.ydzt == "预定结束") {
						$.messager.alert("提示", "此课程已预定结束");
						return;
					}

					var scheId = selected.kcxh;
					var url = "yueyogaPadAdmin/ajaxMemberReserveLession.jhtml";
					$.post(url, {
						scheId : scheId,
						memberId : memberId
					}, function(json) {
						if (json.success) {
							$("#reserve-lession-list").datagrid("load");
							$("#already-reserved-lession-list").datagrid("load");
						} else {
							$.messager.alert("错误", json.error);
						}
					}, "json");
				}
			}, {
				text : "&nbsp;&nbsp;取消预定&nbsp;&nbsp;",
				handler : function() {
					var selected = $("#already-reserved-lession-list").datagrid("getSelected");
					if (selected == undefined || selected == null) {
						$.messager.alert("提示", "请选中您要取消预定的课程");
						return;
					}

					var url = "yueyogaPadAdmin/ajaxMemberCancelReserveLession.jhtml";
					$.post(url, {
						scheduleId : selected.kcxh,
						memberId : memberId
					}, function(json) {
						if (json.success) {
							$("#reserve-lession-list").datagrid("load");
							$("#already-reserved-lession-list").datagrid("load");
						} else {
							$.messager.alert("错误", "取消预定失败");
						}
					}, "json");
				}
			}, {
				text : "&nbsp;&nbsp;出席&nbsp;&nbsp;",
				handler : function() {
					var selected = $("#already-reserved-lession-list").datagrid("getSelected");
					if (selected == undefined || selected == null) {
						$.messager.alert("提示", "请选中您要出席的课程");
						return;
					}

					var resvId = selected.ydbh;//预订编号
					var prId = $("#cacheMemberProductRemainingId").val();//产品使用情况id
	
					if(prId == undefined || prId == null || prId == ""){
						$.messager.alert("提示","请先选择要出席的会员");
						return;
					}

					var url = "yueyogaPadAdmin/ajaxMemberAttend.jhtml";
					$.post(url, {
						resvId : resvId,
						prId : prId
					}, function(json) {
						if (json.success) {
							$("#already-reserved-lession-list").datagrid("load");
							$("#already-attended-lession-list").datagrid("load");
						} else {
							$.messager.alert("错误", json.msg);
						}
					}, "json");
				}
			}, {
				text : "&nbsp;&nbsp;取消出席&nbsp;&nbsp;",
				handler : function() {
					var selected = $("#already-attended-lession-list").datagrid("getSelected");
					if (selected == undefined || selected == null) {
						$.messager.alert("提示", "请选中您要取消出席的课程");
						return;
					}

					var resvId = selected.ydbh;//预订编号
					var prId = $("#cacheMemberProductRemainingId").val();//产品使用情况id
	
					if(prId == undefined || prId == null || prId == ""){
						$.messager.alert("提示","请先选择要取消出席的会员");
						return;
					}

					var url = "yueyogaPadAdmin/ajaxCancelMemberAttend.jhtml";
					$.post(url, {
						resvId : resvId,
						prId : prId
					}, function(json) {
						if (json.success) {
							$("#reserve-lession-list").datagrid("load");
							$("#already-reserved-lession-list").datagrid("load");
							$("#already-attended-lession-list").datagrid("load");
						} else {
							$.messager.alert("错误", json.msg);
						}
					}, "json");
				}
			}, {
				text : "&nbsp;&nbsp;取消&nbsp;&nbsp;",
				handler : function() {
					$("#reserveDetailDialog").dialog("close");
				}
			} ]
		});

		//弹出对话框
		$("#reserveDetailDialog").dialog("open");

		var searchDateRow = $("#lession-date-list tbody tr:first td a.date-today");
		var searchDate = searchDateRow.text();
		
		//获取今天日期
		if (flag == 1) {
			var rowIndex = searchDateRow.parent().index();
			if(rowIndex == 6){//周日
				searchDate = $("#lession-date-list tbody tr:last td:first a").text();
			}else {
				searchDate = $("#lession-date-list tbody tr:first td:eq("+(rowIndex+1)+") a").text();
			}
		}

		//加载今天课程
		$("#reserve-lession-list").datagrid({
			url : "yueyogaPadAdmin/ajaxGetDayLessionList.jhtml",
			border : false,
			singleSelect : true,
			autoRowHeight : false,
			queryParams : {
				kcrq : searchDate,
				memberId : memberId,
				clazzId : classId
			},
			rowStyler : function(idx, row) {
				if (row.ydzt == "预定结束") {
					return "background-color:#eee";
				} else {
					return "";
				}
			}
		});

		var resvTitle = "今天预定";
		if(flag == 1){
			resvTitle = "明天预定";
		}
		//加载个人已经预定的课程
		$("#already-reserved-lession-list").datagrid({
			title : resvTitle,
			url : "yueyogaPadAdmin/ajaxReserveLessionList.jhtml",
			border : false,
			singleSelect : true,
			queryParams : {
				searchDate : searchDate,
				memberId : memberId,
				clazzId : classId
			}
		});
		
		if(flag == 0){
			//加载个人已经出席的课程
			$("#already-attended-lession-list").show();
			$("#already-attended-lession-list").datagrid({
				title : "今日出席",
				url : "yueyogaPadAdmin/ajaxSearchAttendList.jhtml",
				border : false,
				singleSelect : true,
				queryParams : {
					searchDate : searchDate,
					memberId : memberId,
					clazzId : classId
				}
			});
		}else {//明天不显示出席
			$("#already-attended-lession-list").hide();
		}
	}
</script>
</head>
<body class="easyui-layout" style="font-size: 62.5%;">
	<div data-options="region:'north'" style="height: 30px;">
		<div style="font-size: 1.4em; line-height: 1.4em; height: 100%; padding-left: 5px; float: left;">印想瑜伽信息管理系统</div>
		<!-- #set(User padLoginUser) -->
		<div style="height: 100%; float: left; font-size: 1.2em; margin-left: 15px; line-height: 1.6em;">尊敬的用户${padLoginUser.username}您好,欢迎登录使用本系统</div>
		<div style="float: right; margin-right: 10px;">
			<a id="logoutBtn" class="easyui-linkbutton" data-options="iconCls:'icon-wanyoga-exit'">安全退出</a>
		</div>
	</div>

	<div data-options="region:'center',border:false">
		<div class="easyui-layout" data-options="fit:true">
			<div data-options="region:'west',title:'会员信息'" style="width: 200px;">
				<div class="member-search" style="padding: 5px;">
					<div>
						<select id="yoga-classes" class="easyui-combobox" data-options="editable:false" style="width: 100%; height: 30px;">
							<!-- #set(List<TinyClass> clazzList) -->
							<!--#for(TinyClass clz : clazzList)-->
							<option value="${clz.classId}">${clz.className}</option>
							<!-- #end -->
						</select>
					</div>
					<div style="margin-top: 5px;">
						<input id="searchMemberDetailBtn" class="easyui-textbox" data-options="prompt:'会员编号/卡号/手机号',buttonText:'&nbsp;&nbsp;查询&nbsp;&nbsp;'" style="width: 100%; height: 30px;" />
					</div>
				</div>
				<div class="member-detail" style="padding: 5px;">
					<div id="headImgContainer" style="width: 165px; height: 200px; text-align: center; border: 1px solid #ddd;">
						<img id="hytx" alt="会员头像" style="max-width: 165px; max-height: 200px;" />
					</div>

					<div id="chooseHeadImgContainer" style="margin-top: 5px;">
						<a id="chooseHeadImgBtn" class="easyui-linkbutton" style="width: 100%;">更换头像</a>
					</div>

					<input id="cacheMemberId" type="hidden" /> <input id="cacheMemberProductRemainingId" type="hidden" />
					<div style="margin-top: 15px;">
						<span>卡号:</span><span id="hykh" style="margin-left: 5px;"></span>
					</div>
					<div style="margin-top: 5px;">
						<span>姓名:</span><span id="hyxm" style="margin-left: 5px;"></span>
					</div>
					<div style="margin-top: 5px;">
						<span>手机号:</span><span id="hysjh" style="margin-left: 5px;"></span>
					</div>
					<div style="margin-top: 5px;">
						<span>卡项:</span><span id="hykx" style="margin-left: 5px;"></span>
					</div>
					<div style="margin-top: 5px;">
						<span>状态:</span><span id="hyzt" style="margin-left: 5px;"></span>
					</div>
					<div style="margin-top: 5px;">
						<span>子状态:</span><span id="hyzzt" style="margin-left: 5px;"></span>
					</div>
					<div style="margin-top: 5px;">
						<span>会籍顾问:</span><span id="hjgw" style="margin-left: 5px;"></span>
					</div>
					<div style="margin-top: 5px;">
						<span>剩余次数:</span><span id="sycs" style="margin-left: 5px;"></span>
					</div>
					<div style="margin-top: 5px;">
						<span>开始时间:</span><span id="kssj" style="margin-left: 5px;"></span>
					</div>
					<div style="margin-top: 5px;">
						<span>截止时间:</span><span id="jssj" style="margin-left: 5px;"></span>
					</div>

					<div style="margin-top: 10px;">
						<a id="searchMemberConsumeListBtn" class="easyui-linkbutton" style="width: 100%;">查看出勤</a>
					</div>

					<div style="margin-top: 5px;">
						<a id="reserveSeatBtn" class="easyui-linkbutton" style="width: 100%;">预约订座</a>
					</div>
				</div>
			</div>
			<div data-options="region:'center'">
				<div id="tabPanel" class="easyui-tabs" data-options="border:false,fit:true">
					<div id="lession-date-list-layout" title="课程列表" class="easyui-layout" data-options="fit:true">
						<div data-options="region:'north',border:false">
							<table id="lession-date-list">
								<thead>
									<tr>
										<th style="text-align: center;">星期一</th>
										<th style="text-align: center;">星期二</th>
										<th style="text-align: center;">星期三</th>
										<th style="text-align: center;">星期四</th>
										<th style="text-align: center;">星期五</th>
										<th style="text-align: center;">星期六</th>
										<th style="text-align: center;">星期日</th>
									</tr>
								</thead>
								<tbody>
									<tr>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
									</tr>
									<tr>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
										<td><a class="easyui-linkbutton" style="width: 60px;"></a></td>
									</tr>
								</tbody>
							</table>
						</div>
						<div data-options="region:'center',border:false" style="border-top: 1px solid #ccc;">
							<table id="lession-list" style="border-top: 1px solid #ddd;" data-options="title:'课程列表',iconCls:'icon-wanyoga-resultlist',fit:true,idField:'id'">
								<thead>
									<tr>
										<th data-options="field:'kcrq'">日期</th>
										<th data-options="field:'ksjs'">时段</th>
										<th data-options="field:'kcmc'">课程</th>
										<th data-options="field:'kccd'">教室</th>
										<th data-options="field:'kcls'">老师</th>
										<th data-options="field:'hyrs'">会员</th>
										<th data-options="field:'cxrs'">出席</th>
										<th data-options="field:'qxrs'">缺席</th>
										<th data-options="field:'zxws'">总席位</th>
									</tr>
								</thead>
							</table>
						</div>
						<div data-options="region:'south',border:false" style="height: 85px; border-top: 1px solid #ccc;">
							<div id="seat-info"></div>
						</div>
					</div>
					<div title="今日课程" data-options="fit:true">
						<table id="today-lession-list" style="border-top: 1px solid #ddd;" data-options="title:'课程列表',iconCls:'icon-wanyoga-resultlist',fit:true,idField:'id'">
							<thead>
								<tr>
									<th data-options="field:'kcrq'">日期</th>
									<th data-options="field:'ksjs'">时段</th>
									<th data-options="field:'kcmc'">课程</th>
									<th data-options="field:'kccd'">教室</th>
									<th data-options="field:'kcls'">老师</th>
									<th data-options="field:'hyrs'">会员</th>
									<th data-options="field:'cxrs'">出席</th>
									<th data-options="field:'qxrs'">缺席</th>
									<th data-options="field:'zxws'">总席位</th>
								</tr>
							</thead>
						</table>
					</div>
					<div title="明日课程" data-options="fit:true">
						<table id="tomorrow-lession-list" style="border-top: 1px solid #ddd;" data-options="title:'课程列表',iconCls:'icon-wanyoga-resultlist',fit:true,idField:'id'">
							<thead>
								<tr>
									<th data-options="field:'kcrq'">日期</th>
									<th data-options="field:'ksjs'">时段</th>
									<th data-options="field:'kcmc'">课程</th>
									<th data-options="field:'kccd'">教室</th>
									<th data-options="field:'kcls'">老师</th>
									<th data-options="field:'hyrs'">会员</th>
									<th data-options="field:'cxrs'">出席</th>
									<th data-options="field:'qxrs'">缺席</th>
									<th data-options="field:'zxws'">总席位</th>
								</tr>
							</thead>
						</table>
					</div>
					<div title="会员信息" data-options="fit:true">
						<div id="member-info-layout" class="easyui-layout" data-options="fit:true">
							<div data-options="region:'north',border:false" style="height: 72px; border-bottom: 1px solid #ddd; padding: 3px;">
								<div style="float: left; margin-left: 15px; margin-top: 5px;">
									<label for="iptHykh" style="margin-right: 5px;">卡号:</label><input id="iptHykh" type="text" class="easyui-textbox" style="width: 120px; height: 25px;" />
								</div>

								<div style="float: left; margin-left: 15px; margin-top: 5px;">
									<label for="iptHysjh" style="margin-right: 5px;">手机号:</label><input id="iptHysjh" type="text" class="easyui-textbox" style="width: 120px; height: 25px;" />
								</div>

								<div style="float: left; margin-left: 15px; margin-top: 5px;">
									<label for="iptHyxm" style="margin-right: 5px;">姓名:</label><input id="iptHyxm" type="text" class="easyui-textbox" style="width: 120px; height: 25px;" />
								</div>

								<div style="float: left; margin-left: 15px; margin-top: 5px;">
									<label for="iptHykx" style="margin-right: 5px;">卡项:</label><select id="iptHykx" class="easyui-combobox" style="width: 120px; height: 25px;">
										<option value="">不限</option>
										<!-- #set(List<Product> products) -->
										<!-- #foreach(Product p in products) -->
										<option value="${p.productId}">${p.name}</option>
										<!-- #end -->
									</select>
								</div>

								<div style="float: left; margin-left: 15px; margin-top: 5px;">
									<a id="searchMemberBtn" class="easyui-linkbutton" data-options="iconCls:'icon-search'" style="width: 60px;">查询</a>
								</div>
							</div>
							<div data-options="region:'center',fit:true,border:false">
								<table id="member-list" style="border-top: 1px solid #ddd; width: 100%"
									data-options="title:'会员列表',iconCls:'icon-wanyoga-resultlist',idField:'hybh',url : 'yueyogaPadAdmin/ajaxGetMemberList.jhtml'">
									<thead>
										<tr>
											<th data-options="field:'hykh'">卡号</th>
											<th data-options="field:'hyxm'">姓名</th>
											<th data-options="field:'lxdh'">电话</th>
											<th data-options="field:'hjgw'">顾问</th>
											<th data-options="field:'cplx'">卡种</th>
											<th data-options="field:'kssj'">有效期(起始)</th>
											<th data-options="field:'jssj'">有效期(结束)</th>
										</tr>
									</thead>
								</table>
							</div>
						</div>
					</div>
					<div title="在店会员" data-options="fit:true">
						<table id="present-member-list" style="border-top: 1px solid #ddd; width: 100%"
							data-options="title:'会员列表',iconCls:'icon-wanyoga-resultlist',idField:'hybh',url : 'yueyogaPadAdmin/ajaxGetPresentMemberList.jhtml'">
							<thead>
								<tr>
									<th data-options="field:'hykh'">卡号</th>
									<th data-options="field:'hyxm'">姓名</th>
									<th data-options="field:'lxdh'">电话</th>
									<th data-options="field:'hjgw'">顾问</th>
									<th data-options="field:'cplx'">卡种</th>
									<th data-options="field:'kssj'">有效期(起始)</th>
									<th data-options="field:'jssj'">有效期(结束)</th>
								</tr>
							</thead>
						</table>
					</div>

					<div title="离店会员" data-options="fit:true">
						<table id="unpresent-member-list" style="border-top: 1px solid #ddd; width: 100%"
							data-options="title:'会员列表',iconCls:'icon-wanyoga-resultlist',idField:'hybh',url : 'yueyogaPadAdmin/ajaxGetUnPresentMemberList.jhtml'">
							<thead>
								<tr>
									<th data-options="field:'hykh'">卡号</th>
									<th data-options="field:'hyxm'">姓名</th>
									<th data-options="field:'lxdh'">电话</th>
									<th data-options="field:'hjgw'">顾问</th>
									<th data-options="field:'cplx'">卡种</th>
									<th data-options="field:'kssj'">有效期(起始)</th>
									<th data-options="field:'jssj'">有效期(结束)</th>
								</tr>
							</thead>
						</table>
					</div>

					<div title="出勤记录" data-options="fit:true">
						<table id="consume-list" style="border-top: 1px solid #ddd; width: 100%" data-options="title:'出勤记录',iconCls:'icon-wanyoga-resultlist',url : 'yueyogaPadAdmin/ajaxGetConsumeList.jhtml'">
							<thead>
								<tr>
									<th data-options="field:'memberCardNo'">卡号</th>
									<th data-options="field:'memberName'">姓名</th>
									<th data-options="field:'className'">班级</th>
									<th data-options="field:'week',formatter:function(value,row,index){return value+' '+row.scheduleStartTime+'~'+row.scheduleEndTime}">课程时间</th>
									<th data-options="field:'scheduleTeacherName'">老师</th>
									<th data-options="field:'schedulePlaceName'">场地</th>
									<th data-options="field:'productName'">卡项</th>
									<th data-options="field:'consumeTime'">出席时间</th>
								</tr>
							</thead>
						</table>
					</div>
				</div>
			</div>
		</div>
	</div>

	<div data-options="region:'south'" style="height: 30px;">
		<div style="text-align: center; padding-top: 7px;">版权所有：青岛印想瑜伽</div>
	</div>

	<div id="reserveDialog" class="easyui-dialog" data-options="closed:true,title:'预约订座',width:300,height:180" style="padding: 5px 0;">
		<div>
			<a id="reserveTodayBtn" class="easyui-linkbutton" style="height: 60px; width: 100%;">预约今天</a>
		</div>
		<div style="margin-top: 5px;">
			<a id="reserveTomorrowBtn" class="easyui-linkbutton" style="height: 60px; width: 100%;">预约明天</a>
		</div>
	</div>

	<!-- 预约订座明细 -->
	<div id="reserveDetailDialog" class="easyui-dialog" data-options="closed:true,width:600,height:580,modal:true">
		<table id="reserve-lession-list">
			<thead>
				<tr>
					<th data-options="field:'ksjs'">时段</th>
					<th data-options="field:'kcmc'">课程</th>
					<th data-options="field:'kccd'">场地</th>
					<th data-options="field:'kcls'">老师</th>
					<th data-options="field:'ydzt'">状态</th>
					<th data-options="field:'hyrs'">会员</th>
				</tr>
			</thead>
		</table>
		<table id="already-reserved-lession-list">
			<thead>
				<tr>
					<th data-options="field:'ksjs'">时段</th>
					<th data-options="field:'kcmc'">课程</th>
					<th data-options="field:'kccd'">场地</th>
					<th data-options="field:'kcls'">老师</th>
					<th data-options="field:'ydzt'">状态</th>
					<th data-options="field:'hyrs',formatter:function(value,row,index){return value.replace('X','/');}">会员</th>
				</tr>
			</thead>
		</table>
		<table id="already-attended-lession-list">
			<thead>
				<tr>
					<th data-options="field:'ksjs'">时段</th>
					<th data-options="field:'kcmc'">课程</th>
					<th data-options="field:'kccd'">场地</th>
					<th data-options="field:'kcls'">老师</th>
					<th data-options="field:'ydzt'">状态</th>
					<th data-options="field:'hyrs',formatter:function(value,row,index){return value.replace('X','/');}">会员</th>
				</tr>
			</thead>
		</table>
	</div>
</body>